<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>搜索</title>
		<script src="../js/mui.min.js"></script>
	    <script src="../js/jquery.3.2.1.js"></script>
	    <link href="../css/mui.min.css" rel="stylesheet"/>
	    <link href="../css/mui_common.css" rel="stylesheet"/>
    	<link rel="stylesheet" type="text/css" href="../css/index/search.css"/>
    	
    	<script type="text/javascript" charset="utf-8">
      		mui.init(); 
    	</script>
	</head>
	<body id="search">
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <div class="input mui-pull-left">
		    	<input type="search" />
		    	<div class="searchText">
		    		卫衣<span>&#xe6a6;</span>
		    	</div>
		    </div>
		    <a href="" class="mui-pull-right Search">搜索</a>
		</header>
		<div class="mui-content">
			<div class="searchTitle">
				<a class="cur">默认</a>
				<a>销量</a>
				<a>价格<i>&#xe675;</i></a>
				<a>筛选</a>
			</div>
			<div class="searchBox">
				<div class="boxCon">
					<ul>
						<li><a href="">
							<img src="../img/index/search/search1.jpg"/>
							<p class="p1">粉色土星刺绣抽绳卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search2.jpg"/>
							<p class="p1">帅气拼接落肩春款设计</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search3.jpg"/>
							<p class="p1">1064光里休闲宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search4.jpg"/>
							<p class="p1">宽松BE纯色圆环开口</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search5.jpg"/>
							<p class="p1">秋季新款韩款宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search6.jpg"/>
							<p class="p1">韩款连帽宽松百搭卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search7.jpg"/>
							<p class="p1">韩款新款百搭甜美圆领卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search8.jpg"/>
							<p class="p1">韩款女装宽松显瘦卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
					</ul>
				</div>
				<div class="boxCon" style="display: none;">
					<ul>
						<li><a href="">
							<img src="../img/index/search/search2.jpg"/>
							<p class="p1">粉色土星刺绣抽绳卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search1.jpg"/>
							<p class="p1">帅气拼接落肩春款设计</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search3.jpg"/>
							<p class="p1">1064光里休闲宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search4.jpg"/>
							<p class="p1">宽松BE纯色圆环开口</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search5.jpg"/>
							<p class="p1">秋季新款韩款宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search6.jpg"/>
							<p class="p1">韩款连帽宽松百搭卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search7.jpg"/>
							<p class="p1">韩款新款百搭甜美圆领卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search8.jpg"/>
							<p class="p1">韩款女装宽松显瘦卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
					</ul>
				</div>
				<div class="boxCon" style="display: none;">
					<ul>
						<li><a href="">
							<img src="../img/index/search/search3.jpg"/>
							<p class="p1">粉色土星刺绣抽绳卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search2.jpg"/>
							<p class="p1">帅气拼接落肩春款设计</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search1.jpg"/>
							<p class="p1">1064光里休闲宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search4.jpg"/>
							<p class="p1">宽松BE纯色圆环开口</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search5.jpg"/>
							<p class="p1">秋季新款韩款宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search6.jpg"/>
							<p class="p1">韩款连帽宽松百搭卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search7.jpg"/>
							<p class="p1">韩款新款百搭甜美圆领卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search8.jpg"/>
							<p class="p1">韩款女装宽松显瘦卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
					</ul>
				</div>
				<div class="boxCon" style="display: none;">
					<ul>
						<li><a href="">
							<img src="../img/index/search/search4.jpg"/>
							<p class="p1">粉色土星刺绣抽绳卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search2.jpg"/>
							<p class="p1">帅气拼接落肩春款设计</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search3.jpg"/>
							<p class="p1">1064光里休闲宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search1.jpg"/>
							<p class="p1">宽松BE纯色圆环开口</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search5.jpg"/>
							<p class="p1">秋季新款韩款宽松卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search6.jpg"/>
							<p class="p1">韩款连帽宽松百搭卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search7.jpg"/>
							<p class="p1">韩款新款百搭甜美圆领卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
						<li><a href="">
							<img src="../img/index/search/search8.jpg"/>
							<p class="p1">韩款女装宽松显瘦卫衣</p>
							<p class="p2">￥ 128.0</p>
						</li></a>
					</ul>
					<div class="zz">
						<div class="select_options">
							<div class="one">
								<div class="one_con">
									<p>非销售</p>
									<p>只看我关注的店铺</p>
								</div>
							</div>
							<div class="two">
								<div class="two_con">
									<p>价格区间(元)：</p>
									<input type="text" placeholder="最低价" class="minPrice" /><span>-</span><input type="text" placeholder="最高价" />
								</div>
							</div>
							<div class="three">
								<div class="three_con">
									<p>尺码范围(多选)：</p>
									<ul id="chima">
										<li class="curr">全部</li>
										<li>XXS</li>
										<li>XS</li>
										<li>S</li>
										<li>M</li>
										<li>L</li>
										<li>XL</li>
										<li>XXL</li>
										<li>3XL</li>
										<li>4XL</li>
										<li>均码</li>
									</ul>
								</div>
							</div>
							<div class="bottom">
								<button>重置</button>
								<button class="qd" id="sear">确定</button>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript">
		$(document).ready(function(){
			$(".searchTitle a").click(function(){
				$(this).addClass("cur").siblings().removeClass("cur");
				var index=$(this).index();
				$(".searchBox") .children().eq(index).css("display","block").siblings().css("display","none");
				$(".zz").css('display','block');
			});
			
			$("#sear").click(function(){
				$(".zz").css('display','none');
				$(".searchTitle").children().eq(0).addClass('cur').siblings().removeClass('cur');
				$(".searchBox") .children().eq(0).css("display","block").siblings().css("display","none");
			});
			
			$("#chima li").click(function(){
				$(this).addClass("curr").siblings().removeClass('curr');
			});
		});
		/*document.getElementById("sear").addEventListener("tap",function(){
				mui.openWindow({
					url:"search.html",
					id:"search",
					createNew:true,
					show:{
						aniShow:"slide-in-right",
						duration:200
					},
					waiting:{
						title:"正在加载……"
					}
				});
			});*/
			
	</script>
</html>
